<div class="formatting">
  <a href="#" class="markdownHeading1" id="header-formatting">
    <span class="markdownHeading1">#</span>
    <span class="markdownHeading2">#</span>
    <span class="markdownHeading3">#</span>
    <span class="markdownHeading4">#</span>
    <span class="markdownHeading5">#</span>
    <span class="markdownHeading6">#</span>
  </a>
  <a href="#" class="markdownBold"><clr-icon shape="bold"></clr-icon>{{i18n 'gui.formatting.bold'}}</a>
  <a href="#" class="markdownItalic"><clr-icon shape="italic"></clr-icon>{{i18n 'gui.formatting.italic'}}</a>
  <a href="#" class="markdownCode"><clr-icon shape="code-alt"></clr-icon>{{i18n 'gui.formatting.code'}}</a>
  <a href="#" class="markdownComment"><clr-icon shape="code"></clr-icon>{{i18n 'gui.formatting.comment'}}</a>
  <hr>
  <a href="#" class="markdownLink"><clr-icon shape="link"></clr-icon>{{i18n 'gui.formatting.link'}}</a>
  <a href="#" class="markdownImage"><clr-icon shape="image"></clr-icon>{{i18n 'gui.formatting.image'}}</a>
  <hr>
  <a href="#" class="markdownBlockquote"><clr-icon shape="block-quote"></clr-icon>{{i18n 'gui.formatting.blockquote'}}</a>
  <a href="#" class="markdownMakeOrderedList"><clr-icon shape="number-list"></clr-icon>{{i18n 'gui.formatting.ol'}}</a>
  <a href="#" class="markdownMakeUnorderedList"><clr-icon shape="bullet-list"></clr-icon>{{i18n 'gui.formatting.ul'}}</a>
  <a href="#" class="markdownMakeTaskList"><clr-icon shape="checkbox-list"></clr-icon>{{i18n "gui.formatting.tasklist"}}</a>
  <a href="#" class="markdownInsertTable"><clr-icon shape="table"></clr-icon>{{i18n 'gui.formatting.insert_table'}}</a>
  <hr>
  <a href="#" class="markdownDivider"><clr-icon shape="minus"></clr-icon>{{i18n 'gui.formatting.divider'}}</a>
  <a href="#" class="insertFootnote"><span class="fn-icon">x<sup>2</sup></span>{{i18n 'gui.formatting.footnote'}}</a>
  <a href="#" class="removeFootnote"><span class="fn-icon" style="text-decoration: line-through">x<sup>2</sup></span>{{i18n 'gui.formatting.remove_footnote'}}</a>
</div>
